<template>
	<view>
		<view class="view">
			<view class="login">
				<text>注册用户</text>
			</view>
			<view style="margin-top: 10%;">
				<uni-forms ref="form">
					<uni-forms-item label="昵称" name="" :required="true">
						<uni-easyinput v-model="user.userName" placeholder="请输入账号昵称" />
					</uni-forms-item>
					<uni-forms-item label="性别" name="" :required="true">
						<radio-group @change="change">
							<label>
								<radio value="男" /><text>男</text>
							</label>
							<label>
								<radio value="女" /><text>女</text>
							</label>
						</radio-group>
					</uni-forms-item>
					<uni-forms-item label="出生年月" name="" :required="true">
						<picker mode="date" @change="dateChange">
							<view>{{user.userBirth}}</view>
						</picker>
					</uni-forms-item>
					<uni-forms-item label="手机号码" name="" :required="true">
						<uni-easyinput v-model="user.userPhone" placeholder="请输入你的手机号码" />
					</uni-forms-item>
					<uni-forms-item label="密码" name="" :required="true">
						<uni-easyinput v-model="user.userPassword" placeholder="请设置密码" type="password"/>
					</uni-forms-item>
					<uni-forms-item label="上传头像" name="" :required="true">
						<uni-file-picker limit="1" @select="select"></uni-file-picker>
					</uni-forms-item>
					<uni-forms-item label="个性化简介" name="">
						<uni-easyinput type="textarea" v-model="user.userIndividuation" placeholder="请输入你的个性化简介" />
					</uni-forms-item>
					<uni-forms-item label="" name="">
						<button type="primary" @click="retrieve">确定</button>
					</uni-forms-item>
				</uni-forms>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user: {
					userName: "",
					userSex: "",
					userBirth: "请选择",
					userPhone: "",
					userImage: "",
					userPassword: "",
					userIndividuation: ""
				},
				
				register:{
					getAccount: "",
					userPassword: "",
				}
			}
		},
		methods: {
			retrieve() {

				uni.request({
					url: this.api.add,
					method: 'POST',
					data: this.user,
					success: res => {
						console.log(res);
						if (res.data.code == 200) {
							this.register.getAccount = res.data.obj
							this.register.userPassword=this.user.userPassword
							let mas=res.data.message
							uni.navigateTo({
								url: '/pages/registrationDetails/registrationDetails?register='+ encodeURIComponent(JSON.stringify(this.register)),
								success: res => {
									uni.showToast({
										title: mas
									});
								},
								fail: () => {},
								complete: () => {}
							});
						} else {
							console.log("else");
							uni.showToast({
								title: res.data.message,
								icon: 'error'
							});
						}
					},
					fail: () => {},
					complete: () => {}
				});
			},
			select(e) {
				console.log(e);
				uni.uploadFile({
					url: this.api.uploading,
					filePath: e.tempFilePaths[0],
					name: "file",
					success: (res) => {
						let imageurl = JSON.parse(res.data)
						console.log(imageurl);
						this.user.userImage = imageurl.obj.url
						console.log(this.user.userImage);
					}
				})
			},
			change(e) {
				console.log(e);
				this.user.userSex = e.detail.value
			},
			dateChange(e) {
				console.log(e);
				this.user.userBirth = e.detail.value
			}
		}
	}
</script>

<style>
	page,
	.view {
		width: 100%;
		height: 100%;
		// background-color:#D3D3D3 ;
	}

	.login {
		margin-left: 10%;
		margin-top: 10%;
		font-size: 24px;
		font-weight: bold;
	}
</style>
